<template>
  <div>
    <common-card
      :title="$t('dashboard.totalCourseViews')"
      :value="this.totalPlay"
    >
      <!-- 底部数据 -->
      <template v-slot:footer>
        <span>{{$t('dashboard.totalCourse')}} </span>
        <span class="emphasis">{{totalCourse}}</span>
      </template>
    </common-card>
  </div>
</template>

<script>
import homeview from "@/api/homeview";
import CommonCard from "../CommonCard";
export default {
  name: "index",
  components: {
    CommonCard,
  },
  data() {
    return {
      chartInstance: null,
      totalPlay: 0, //视频总点击量
      totalCourse: 0, //课程总类数
      xData: [], //x轴数据
      yData: [], //y轴数据
    };
  },
  mounted() {
    this.getData();
  },
  methods: {
    // 获取服务器的数据
    getData() {
      homeview
        .getVideoClickNum()
        .then((res) => {
          this.xData = res.data.data.partName;
          this.yData = res.data.data.cliNum;

          this.totalPlay = res.data.data.cliNum.reduce(function (prev, curr) {
            return prev + curr;
          });
          this.totalCourse = res.data.data.partName.length;
        })
        .catch((error) => {
          console.log("error");
        });
    },
  },
};
</script>

<style lang="scss" scoped>
</style>
